let div = document.createElement('div')
let dragging = false
let lastX
let lastY

div.className = 'demo'
document.body.appendChild(div)

div.onmousedown = (e) => {
  lastX = e.clientX
  lastY = e.clientY
  dragging = true
}


document.body.onmousemove = e => {
  if(dragging === true){
  let deltaX = e.clientX -lastX
  let deltaY = e.clientY - lastY
  let top = parseInt(div.style.top) || 0
  let left = parseInt(div.style.left) || 0

  console.log('deltaX, deltaY')
  console.log(deltaX, deltaY)

  div.style.top = top + deltaY + 'px'
  div.style.left = left + deltaX + 'px'

  lastX = e.clientX
  lastY = e.clientY
  }
}

document.onmouseup = () => {
  dragging = false
}